<%@ page import="databeans.Employee"%>
<%
	Employee employee = (Employee)session.getAttribute("employee");
	String employeeUsername = employee.getUsername();
	String employeeFirstName = employee.getFirstName();
	String employeeLastName = employee.getLastName();
%>
<jsp:include page="../common/header.jsp" />

<script type="text/javascript">
	$(document).ready(function() { 

        $("#popup").dialog({ bgiframe: true, autoOpen:false, modal: true, closeOnEscape: true, draggable:false, width:700, height:500, position: 'top', buttons: { "Close": function() { $(this).dialog('close'); } } });
		
		$('a#order-click').click(function(e) { 
			e.preventDefault(); 
			$('#popup').dialog('open'); 
		});
		$('.fund_graph').visualize({type: 'line', parseDirection:'x', pieLabelPos:'outside', height: 230, width:320, colors:['#8CCE3B','#92d5ea','#ee8310','#be1e2d']});
		$('#colorize_1').colorize({ hoverColor:'none', ignoreHeaders :true, hiliteColor :'none' });
		$('#colorize_2').colorize({ hoverColor:'none', ignoreHeaders :true, hiliteColor :'none' });

	});
</script>

<title>Carnegie Financial Services - Customer Dashboard</title>
</head>

<body>
	<div id="container">
    	<div id="header">
        	<h2>Carnegie Financial Services</h2>
    		<jsp:include page="../common/top-menu.jsp" />
      </div>
        <div id="wrapper">
            <div id="content">
            <jsp:include page="../common/messages.jsp"/>
       			<!-- 
       			<div id="rightnow">
                    <h3 class="reallynow">
                        <span>Welcome, <%=employeeFirstName + " " + employeeLastName %></span>
                        <br />
                    </h3>
				    <p class="youhave"><a href="#" title="Click to view Pending orders" id="order-click">19 transactions</a> pending</p>
			  	</div> 
			  -->
              <div id="infowrap">
              	<div id="infobox" class="graph">
                    <h3>Fund Activity</h3>
                    <table class="fund_graph">
	    				<thead>
							<tr>
								<td></td>
								<th>Mon</th>
								<th>Tue</th>
								<th>Wed</th>
								<th>Thu</th>
								<th>Fri</th>
								<th>Sat</th>
								<th>Sun</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<th>Fund 1</th>
								<td>102</td>
								<td>118</td>
								<td>95</td>
								<td>112</td>
								<td>90</td>
								<td>120</td>
								<td>110</td>
							</tr>
							<tr>
								<th>Fund 2</th>
								<td>90</td>
								<td>120</td>
								<td>110</td>
								<td>131</td>
								<td>118</td>
								<td>95</td>
								<td>112</td>
							</tr>
							<tr>
								<th>Fund 3</th>
								<td>9</td>
								<td>16</td>
								<td>20</td>
								<td>17</td>
								<td>19</td>
								<td>22</td>
								<td>26</td>
							</tr>

						</tbody>
	    			</table>
	    			<div class="padding"></div>
                  </div>
                  <div id="infobox" class="margin-left">
                    <h3>Most Active Funds</h3> 
                      <table id="colorize_1">
						<thead>
							<tr>
                            	<th>Fund Name</th>
                                <th>Price</th>
                                <th>Orders</th>
                            </tr>
						</thead>
						<tbody>
							<tr>
                            	<td><a href="#">Mutual Fund 3</a></td>
                                <td>$ 199.00</td>
                                <td>2400</td>
                            </tr>
							<tr>
                            	<td><a href="#">Mutual Fund 1</a></td>
                            	<td>$ 365.24</td>
                                <td>1900</td>
                            </tr>
							<tr>
                            	<td><a href="#">Mutual Fund 4</a></td>
                                <td>$ 59.50</td>
                                <td>1211</td>
                            </tr>
							<tr>
                            	<td><a href="#">Mutual Fund 2</a></td>
                                <td>$ 199.00</td>
                                <td>1040</td>
                            </tr>
                            <tr>
                            	<td><a href="#">Mutual Fund 5</a></td>
                                <td>$ 499.00</td>
                                <td>600</td>
                            </tr>
						</tbody>
					</table>
                  </div>
                  <div class="margin-left" id="infobox">
                    <h3>Last 5 Orders</h3>
                    <table id="colorize_2">
						<thead>
							<tr>
                            	<th>Fund</th>
                                <th>Shares</th>
                                <th>Value</th>
                            </tr>
						</thead>
						<tbody>
							<tr>
                            	<td><a href="#" title="Click to View Fund Performance">Mutual Fund 1</a></td>
                                <td>100</td>
                                <td>$ 2500.00</td>
                            </tr>
							<tr>
                            	<td><a href="#" title="Click to View Fund Performance">Mutual Fund 2</a></td>
                            	<td>200</td>
                                <td>$ 8000.00</td>
                            </tr>
							<tr>
                            	<td><a href="#" title="Click to View Fund Performance">Mutual Fund 3</a></td>
                                <td>150</td>
                                <td>$ 6000.00</td>
                            </tr>
							<tr>
                            	<td><a href="#" title="Click to View Fund Performance">Mutual Fund 4</a></td>
                                <td>55</td>
                                <td>$ 5500.00</td>
                            </tr>
                            <tr>
                            	<td><a href="#" title="Click to View Fund Performance">Mutual Fund 5</a></td>
                                <td>20</td>
                                <td>$ 2000.00</td>
                            </tr>
						</tbody>
					</table>            
                  </div>
              </div>
            </div>
            <jsp:include page="../common/sidebar.jsp" />
      </div>
        <jsp:include page="../common/footer.jsp" />
</div>

<!-- html for jQuery Graph. Populate with values from DB -->
<div id="popup" title="Pending Orders">
<table id="trans-history">
	<thead>
		<tr>
        	<th>Date</th>
            <th>Transaction Type</th>
            <th>Fund Name</th>
            <th>Shares</th>
            <th>Share Price</th>
            <th>$ Amount</th>
            <th>Status</th>
        </tr>
	</thead>
	<tbody>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
		<tr>
			<td>18/01/2010</td>
			<td>Buy</td>
			<td>Mutual Fund 3</td>
			<td>10</td>
			<td>$45.00</td>
			<td>$450</td>
			<td><span class="pending pad-left-20">Pending</span></td>
		</tr>
	</tbody>
</table>
</div>
</body>
</html>
